import React from 'react'
import s from './style.module.less'
import Lazyload from 'react-lazyload'
import loading from '../../assets/home/loading.gif'
export function Article(props) {
    const { title, author, time, pic, text, icon, label } = props
    return (
        <div>
            <div className={s.main}>
                <div className={s.title}>
                    {title}
                </div>
                <div className={s.content}>
                    <div className={s.textdesc}>
                        <div className={s.header}>
                            <div className={s.author}>
                                {author}
                            </div>
                            <div className={s.time}>
                                {time}
                            </div>
                        </div>
                        <div className={s.body}>
                            {text}
                        </div>
                    </div>
                    <div className={s.img}>
                        <div className={s.imgsrc}>
                        {/* <Lazyload placeholder={<img src={loading}  />}> */}
                            <img src={pic} alt="" className={s.imgCurrency} />
                        {/* </Lazyload> */}
                        </div>
                    </div>
                </div>
                <div className={s.lawer}>
                    <div className={s.left}>
                        <div className={s.icon}>
                            <div className={s.zan}>
                                <div>
                                    <svg className="icon" aria-hidden="true">
                                        <use xlinkHref={icon.zan}></use>
                                    </svg>
                                </div>
                                <div>{icon.zanNum}</div>
                            </div>
                            <div className={s.zan}>
                                <div>
                                    <svg className="icon" aria-hidden="true">
                                        <use xlinkHref={icon.mes}></use>
                                    </svg>
                                </div>
                                <div>{icon.mesNum}</div>
                            </div>
                        </div>
                    </div>
                    <div className={s.right}>
                        {label}
                    </div>
                </div>
            </div>
        </div>
    )
}